<template>
	<view>
		<view style="height: 350rpx;" class="flex justify-center align-center font-lg pt-5 pb-3">
			<text class="font-lg" style="text-align: center;">细信聊天</text>
		</view>
		<view class="px-3">
			<input type="text" class="bg-light  px-3 mb-3" style="height: 100rpx;" v-model="username"
				placeholder="请输入用户名" name="" id="">
			<input class="bg-light  px-3 mb-3" style="height: 100rpx;" type="safe-password" :password="true"
				v-model="password" placeholder="请输入密码" name="" id="">
			<input class="bg-light  px-3 mb-3" style="height: 100rpx;" :password="true" v-if="type == 'register'"
				type="safe-password" v-model="repassword" placeholder="请输入确认密码" name="" id="">
		</view>
		<view class="p-3 flex align-center justify-center">
			<view class="flex main-bg-color rounded p-3 align-center justify-center flex-1" hover-class="main-bg-hover-color"
				@click="submit">
				<text class="text-white font-md" style="text-align: center;">{{type == 'login' ?'登录':'注册'}}</text>
			</view>
		</view>
		<view style="display: flex;justify-content: center; align-items: center;flex-direction: row;">
			<text class="text-muted font p-2" @click="changeType">{{type == 'login' ?'注册账号':'登录账号'}}</text>
			<text class="text-muted font">|</text>
			<text class="text-muted font p-2">忘记密码</text>

		</view>
	</view>
</template>

<script>
	import $H from '../../utils/request.js';
	export default {
		data() {
			return {
				type: "login",
				username: "",
				password: "",
				repassword: ""
			}
		},
		mounted() {
			if (window.localStorage.getItem("token")) {
				uni.switchTab({
					url: "/pages/tabbar/index/index"
				})
			}

			console.log(123)
		},
		methods: {
			async submit() {
				if (this.type == 'register') {
					console.log("注册")
					if (this.username == '' || this.password == '' || this.repassword == '') {
						uni.showToast({
							title: "请输入用户名或密码",
							icon: 'none'
						})

					} else if (this.password !== this.repassword) {
						uni.showToast({
							title: "密码和确认密码应相等",
							icon: 'none'
						})
					} else {
						let data = {
							username: this.username,
							password: this.password,
						}
						$H.post("user/reg", data, {
							token: false
						}).then(res => {
							console.log(res, "res")

							uni.showToast({
								title: "注册成功"
							})
							this.type = 'login';
							this.username = "";
							this.password = ""

						})


					}
				} else {
					console.log("登录")
					if (this.username == '' || this.password == '') {
						uni.showToast({
							title: "请输入用户名或密码",
							icon: 'none'
						})
					} else {


					let data = {
						username: this.username,
						password: this.password,
					}
						$H.post("user/login", data, {
							token: false
						}).then(res => {
							console.log(res,"登录res")
							this.$store.dispatch("login",res)
							uni.showToast({
								title: "登录成功"
							})
							// window.localStorage.setItem("token", res.data.token);
							uni.switchTab({
								url: "/pages/tabbar/index/index"
							})

						})

					}

				}
			},
			changeType() {
				if (this.type == 'login') {
					this.type = "register"
				} else {
					this.type = "login"
				}

			}
		}
	}
</script>

<style>

</style>
